<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="Keywords" content="网站关键词">
    <meta name="Description" content="网站介绍">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/iconfont.css">
    <link rel="stylesheet" href="./css/reg.css">

    <script src="/web/js/vue.min.js"></script>
    <script src="/web/js/axios.js"></script>
    <script src="/web/js/http.js"></script>
    <link rel="stylesheet" href="/web/css/element.css">
    <script src="/web/js/element.js"></script>
</head>
<body>
<div id="ajax-hook"></div>
<div class="wrap" id="login">
    <div class="wpn">
        <div class="form-data pos">
            <a href=""><img src="./img/logo.png" class="head-logo"></a>
            <div class="change-login">
                <p class="account_number on" >账号登录</p>
                <p class="message">短信登录</p>
            </div>
            <div class="form1">
                <p class="p-input pos">
                    <label for="num" >用户名/手机号</label>
                    <input type="text" id="num" v-model="user.name">
                    <span class="tel-warn num-err hide"><em>账号或密码错误，请重新输入</em><i class="icon-warn"></i></span>
                </p>
                <p class="p-input pos">
                    <label for="pass">请输入密码</label>
                    <input type="password"   style="display:none"/>
                    <input type="password" id="pass" autocomplete="new-password" v-model="user.password">
                    <span class="tel-warn pass-err hide"><em>账号或密码错误，请重新输入</em><i class="icon-warn"></i></span>
                </p>
                <p class="p-input pos code hide">
<!--                    <label for="veri">请输入验证码</label>-->
<!--                    <input type="text" id="veri">-->
<!--                    <img src="">-->
<!--                    <span class="tel-warn img-err hide"><em>账号或密码错误，请重新输入</em><i class="icon-warn"></i></span>-->
<!--                    &lt;!&ndash; <a href="javascript:;">换一换</a> &ndash;&gt;-->
                </p>
            </div>
            <div class="form2 hide">
                <p class="p-input pos">
                    <label for="num2">手机号</label>
                    <input type="number" id="num2">
                    <span class="tel-warn num2-err hide"><em>账号或密码错误</em><i class="icon-warn"></i></span>
                </p>
                <p class="p-input pos">
                    <label for="veri-code">输入验证码</label>
                    <input type="number" id="veri-code">
                    <a href="javascript:;" class="send">发送验证码</a>
                    <span class="time hide"><em>120</em>s</span>
                    <span class="tel-warn error hide">验证码错误</span>
                </p>
            </div>
            <div class="r-forget cl">
                <a href="./reg.html" class="z">账号注册</a>
                <a href="./getpass.html" class="y">忘记密码</a>
            </div>
            <button class="lang-btn off log-btn" @click="loginClick()">登录</button>
        </div>
    </div>
</div>
<script src="../js/jquery.js"></script>
<script src="../js/agree.js"></script>
<script src="../js/login.js"></script>
<!--<script src="../js/http.js"></script>-->

</body>


<script>
    var app = new Vue({
        el: '#login',
        data: {
            user: {
                name: '',
                password:'',
            },
        },
        methods:{
            loginClick(){
                console.log(this.user);

                postRequest("/shopping_boot/App/sysUser/login",this.user).then(res=>{
                    console.log("获取：",res)

                    if (res.code===200) {
                        alert("登录成功！欢迎回来")

                        window.localStorage.setItem('token', res.data.token)
                        location.href = "/web/app/home.html"
                    }
                })
            }
        }
    })
</script>
</html>